<button id="okBtn">ok</button>
<button id="cancelBtn">cancel</button>
<script>
console.log(this)
const onClick = function() {
  console.log(this)
  this.style.backgroundColor =
    this.style.backgroundColor === 'red' ? 'blue' : 'red'
}
const btn = document.getElementById('okBtn')
btn.onclick = onClick
const btn2 = document.getElementById('cancelBtn')
btn2.onclick = onClick
</script>



<script>
function createBtn(text, backgroundColor) {
  const btn = {
    text,
    backgroundColor,
    init() { // 初始化
      console.log(this)
      this.el.addEventListener('click',
        () => {
          console.log(this.getString())
        }
      )
    },
    getString() {
      return this.text + ',' + this.backgroundColor
    }
  }
  const el = document.createElement('button')
  el.style.backgroundColor = btn.backgroundColor
  el.innerText = text
  document.body.append(el)
  btn.el = el
  btn.init()
  return btn
}

const myBtn = createBtn('好的', 'yellow')
const myBtn2 = createBtn('不好', 'pink')

function Cat() {

}
let cat = new Cat()

const Dog = () => {}
let dog = new Dog() // ❌


</script>